<!DOCTYPE html>
<html lang="en">
<head>
    <title>批扣</title>
    <#include "../inc/header.ftl"/>
</head>
<body>
<div class="main-container ace-save-state" id="main-container">

    <div class="main-content">
        <div class="main-content-inner">

            <div class="page-content">
                <div class="row">
                    <div class="col-xs-12">
                        <table id="MainGrid"></table>
                        <div id="toolbar">
                            <div style="padding:8px">&emsp;
                                账户：<input id="payeeaccountcodefind" name="payeeaccountcodefind">
                                收款日期：<input id="paybankdt" class="easyui-datebox" style="width:140px">&emsp;

                                <a href="#" onclick="javascript:searchInfo()" class="easyui-linkbutton"
                                   iconCls="icon-search">查 询</a>
                            </div>
                            <div style="padding:8px 8px 4px">
                                <a href="#" class="easyui-linkbutton" iconCls="icon-edit"
                                   onclick="javascript:editInfo()">修改</a>
                                <a href="#" class="easyui-linkbutton" iconCls="icon-redo"
                                   onclick="javascript:sendInfo(1)">发送</a>
                                <a href="#" class="easyui-linkbutton" iconCls="icon-back"
                                   onclick="javascript:sendInfo(2)">冲销</a>
                                <a href="#" class="easyui-linkbutton" iconCls="icon-print"
                                   onclick="javascript:exportInfo()">导出</a>
                            </div>
                        </div>
                    </div>
                </div><!-- /.row -->
            </div><!-- /.page-content -->
            <div id="box-update" class="ui-dialog-content hide" data-options="minimizable:true,maximizable:true">
                <form class=" form-horizontal
            " id="form-update" method="post">
                    <div class="form-group">
                        <label class="control-label col-xs-12 col-sm-1 no-padding-right">区域编码名称&nbsp;</label>
                        <div class="col-xs-12 col-sm-3">
                                    <span class="block input-icon input-icon-right">
                                        <input type="text" name="cantonname" id="cantonname"
                                               class="col-xs-12 easyui-validatebox" editable="false"
                                               data-options="required:true,readonly:true"/>
                                    </span>
                        </div>
                        <label class="control-label col-xs-12 col-sm-1 no-padding-right">单位标识</label>
                        <div class="col-xs-12 col-sm-3">
                                    <span class="block input-icon input-icon-right">
                                        <input type="text" name="unitid" id="unitid"
                                               class="col-xs-12 easyui-validatebox"
                                               data-options="required:true,readonly:true">
                                    </span>
                        </div>
                        <label class="control-label col-xs-12 col-sm-1 no-padding-right">单位&nbsp;</label>
                        <div class="col-xs-12 col-sm-3">
                                    <span class="block input-icon input-icon-right">
                                        <input type="text" name="unitname" id="runitname"
                                               class="col-xs-12 easyui-validatebox"
                                               data-options="required:true,readonly:true">
                                    </span>
                        </div>
                    </div>
                    <div class="form-group">

                        <input type="text" name="deductid" id="deductid" hidden/>
                        <label class="control-label col-xs-12 col-sm-1 no-padding-right">收款户名</label>
                        <div class="col-xs-12 col-sm-3">
                                    <span class="block input-icon input-icon-right">
                                         <input type="text" name="payeeaccountname" id="payeeaccountname"
                                                class="col-xs-12 easyui-validatebox"
                                                data-options="required:true,readonly:true"/>
                                    </span>
                        </div>

                        <label class="control-label col-xs-12 col-sm-1 no-padding-right">收款银行账号&nbsp;</label>
                        <div class="col-xs-12 col-sm-3">
                                    <span class="block input-icon input-icon-right">
                                        <input type="text" name="payeeaccountcode" id="payeeaccountcode"
                                               class="col-xs-12 easyui-validatebox"
                                               data-options="required:true,readonly:true"/>
                                    </span>
                        </div>

                        <label class="control-label col-xs-12 col-sm-1 no-padding-right">收款银行开户行</label>

                        <div class="col-xs-12 col-sm-3">
                                  <span class="block input-icon input-icon-right">
                                    <input type="text" name="payeebankname" id="payeebankname"
                                           class="col-xs-12 easyui-validatebox"
                                           data-options="required:true,readonly:true"/>
                                  </span>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="control-label col-xs-12 col-sm-1 no-padding-right">收款时间</label>
                        <div class="col-xs-12 col-sm-3">
                                  <span class="block input-icon input-icon-right">
                                    <input type="text" name="accountdate" id="accountdate"
                                           class="col-xs-12 easyui-validatebox"
                                           data-options="required:true,readonly:true"/>
                                  </span>
                        </div>
                        <label class="control-label col-xs-12 col-sm-1 no-padding-right">收款网点</label>
                        <div class="col-xs-12 col-sm-3">
                                  <span class="block input-icon input-icon-right">
                                      <input type="text" name="bankstation" id="bankstationname"
                                             class="col-xs-12 easyui-validatebox"
                                             data-options="required:true,limitToList:true , missingMessage :'请选择,只能选择哦'" style="width: 100%"/>
                                  </span>
                        </div>

                        <label class="control-label col-xs-12 col-sm-1 no-padding-right">交易流水号&nbsp;</label>
                        <div class="col-xs-12 col-sm-3">
                                  <span class="block input-icon input-icon-right">
                                    <input type="text" name="bankaffirm" id="bankaffirm"
                                           class="col-xs-12 easyui-numberbox" data-options="required:true,precision:0, missingMessage :'请输入数字'" style="width: 100%"/>
                                  </span>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="control-label col-xs-12 col-sm-1 no-padding-right">付款人&nbsp;</label>
                        <div class="col-xs-12 col-sm-3">
                                  <span class="block input-icon input-icon-right">
                                    <input type="text" name="payer" id="payer"
                                           class="col-xs-12 easyui-validatebox" data-options="required:true"/>
                                  </span>
                        </div>
                        <label class="control-label col-xs-12 col-sm-1 no-padding-right">付款人账号&nbsp;</label>
                        <div class="col-xs-12 col-sm-3">
                                  <span class="block input-icon input-icon-right">
                                     <input type="text" name="payeraccountcode" id="payeraccountcode"
                                            class="col-xs-12 easyui-validatebox"
                                            data-options="required:true,readonly:true" />
                                  </span>
                        </div>

                        <label class="control-label col-xs-12 col-sm-1 no-padding-right">付款人账户名&nbsp;</label>
                        <div class="col-xs-12 col-sm-3">
                                    <span class="block input-icon input-icon-right">
                                      <input type="text" name="payeraccountname" id="payeraccountname"
                                             class="col-xs-12 easyui-validatebox"
                                              data-options="required:true,readonly:true" style="width: 100%"/>
                                     </span>
                        </div>

                    </div>
                    <div class="form-group">
                        <label class="control-label col-xs-12 col-sm-1 no-padding-right">金额&nbsp;</label>
                        <div class="col-xs-12 col-sm-3">
                                  <span class="block input-icon input-icon-right">
                                      <input type="text" name="fund" id="fund"
                                             class="col-xs-12 easyui-numberbox"
                                             data-options="required:true" style="width: 100%"/>
                                  </span>
                        </div>

                        <label class="control-label col-xs-12 col-sm-1 no-padding-right">附言&nbsp;</label>
                        <div class="col-xs-12 col-sm-3">
                                    <span class="block input-icon input-icon-right">
                                      <input type="text" name="postscript" id="postscript"
                                             class="col-xs-12 easyui-validatebox"
                                             data-options="required:true,readonly:true" style="width: 251%"/>
                                     </span>
                        </div>


                    </div>
                </form>
            </div><!-- #dialog-confirm -->
            <#--修改-->
            <div id="SendBox-add" class="ui-dialog-content hide">
                <div style="padding:8px">
                    复核用户编码：<input id="usercode" class="easyui-textbox" style="width:140px" data-options="required:true">&emsp;
                    复核用户密码：<input id="userpwd" class="easyui-textbox" style="width:140px" data-options="required:true">&emsp;
                    <input id="biaoshi" hidden>&emsp;
                    <a href="#" class="easyui-linkbutton" iconCls="icon-redo" onclick="javascript:pageSendInfo()"><span
                                id="sendClean"></span></a>
                    <a href="#" class="easyui-linkbutton" iconCls="icon-back" onclick="javascript:cancelInfo()"><span
                                id="sendCleanCan"></span></a>
                </div>
                <table id="SendMainGrid"></table>
            </div>
        </div>
    </div><!-- /.main-content -->
</div><!-- /.main-container -->

<!-- basic scripts -->
<#include "../inc/basicjs.ftl"/>

<!-- inline scripts related to this page -->
<script type="text/javascript">
    //列表-------------------------------------------------
    jQuery(function ($) {
        listPage();
    });

    function searchInfo() {
        listPage(prefix + '/bill/deduct/findDeductPage', 1)
    }
    function listPage(url,mark) {
        if(mark==1){
            var payeeaccountcode= $('#payeeaccountcodefind').val();
            var paybankdt= $('#paybankdt').val();
            // if(payeraccountcode==null||payeraccountcode==''){
            //     $.messager.alert('提示', '请选择账户', 'info');
            //     return;
            // }
        }
        // 右侧表格
        $('#MainGrid').datagrid({
            url: url,
            checkbox: true,
            pagination: true,
            fitColumns: false,
            striped: true,
            singleSelect: false,
            loadMsg: "正在加载数据，请稍后...",
            queryParams: {payeeaccountcode: payeeaccountcode, paybankdt: paybankdt},
            columns: [[
                {field: 'ck', checkbox: true},
                { title: '区划编码名称',field: 'cantonname',width:100},
                { title: '单位标识', field: 'unitid',  width: 110 },
                { title: '单位',	field: 'unitname',width:100},
                { title: '收款户名',	field: 'payeeaccountname',width:110},
                { title: '收款银行帐号',	field: 'payeeaccountcode',width:110},
                { title: '收款银行开户行',	field: 'payeebankname',width:150},
                { title: '收款时间', field: 'accountdate', width: 110 },
                { title: '收款网点', field: 'bankstation',width: 100 },
                { title: '交易流水号', field: 'bankaffirm', width: 100 },
                { title: '付款人', field: 'payer', width: 110 },
                { title: '付款人账号', field: 'payeraccountcode',  width: 110 },
                { title: '付款人账户名', field: 'payeraccountname', width: 100 },
                { title: '金额', field: 'fund', width: 100 },
                { title: '附言', field: 'postscript',  width: 100 }
            ]],
            toolbar: '#toolbar'

        });
        $(window).resize(function () {
            $('#MainGrid').datagrid('resize');
        });

    }

    //收款网点下拉框
    $('#bankstationname').combobox({
        url: prefix + '/base/basedata/findBankStation',
        valueField: 'bankstationname',
        textField: 'bankstationname'
    })

    $('#MainGrid').datagrid({
        onDblClickCell: function(index){
            $("#MainGrid").datagrid("selectRow",index);
            editInfo();
        }
    });
    function editInfo() {
        var rows = $('#MainGrid').datagrid('getSelections');
        if (rows.length == 0) {
            $.messager.alert('提示', '请选择要编辑的数据', 'info');
            return;
        }
        if (rows.length>1) {
            $.messager.alert('提示', '修改操作不能多选', 'info');
            return;
        }

        $('#form-update').form('load',rows[0]);
        showForm();

    }

    function showForm() {
        $("#box-update").removeClass('hide').dialog({
            title: '&nbsp;修改',
            iconCls: 'icon-save',
            width: 800,
            height: 500,
            modal: true,
            buttons: [{
                text: '保存',
                iconCls: 'icon-ok',
                width: 80,
                plain: false,
                handler: function () {
                    $('#form-update').form({
                        url: prefix + '/bill/deduct/saveDeduct',
                        onSubmit: function () {
                            var isValid = $(this).form('validate');
                            if (isValid > 0) {
                                $.messager.progress({
                                    title: '提示',
                                    msg: '数据处理中，请稍候……',
                                    text: ''
                                });
                            }
                            return isValid;
                        },
                        success: function (data) {
                            $.messager.progress('close');
                            var data = eval('(' + data + ')');
                            if (data.success) {
                                searchInfo();
                                $('#box-update').dialog('close');
                            }
                            $.messager.alert('提示', data.msg, 'info');
                        }
                    });
                    $('#form-update').submit();
                }
            }, {
                text: '取消',
                iconCls: 'icon-cancel',
                width: 80,
                plain: false,
                handler: function () {
                    $('#box-update').dialog('close')
                }
            }]
        });
    }

    //发送/冲销
    function sendInfo(opt) {


        $('#biaoshi').val(opt);
        var tit = (opt == 1) ? '发送' : '冲销';
        if (opt == 1) {
            $('#sendClean').text('确认发送');
            $('#sendCleanCan').text('取消发送');
        } else {
            $('#sendClean').text('确认冲销');
            $('#sendCleanCan').text('取消冲销');
        }
        var row = $('#MainGrid').datagrid('getSelections');
        if (row.length == 0) {
            $.messager.alert('提示', '请选择要发送的数据', 'info');
            return;
        }
        $("#SendBox-add").removeClass('hide').dialog({
            title: '&nbsp;' + tit,
            iconCls: 'icon-add',
            width: 600,
            height: 500,
            modal: true,
            buttons: [{
                text: '取消',
                iconCls: 'icon-cancel',
                width: 80,
                plain: false,
                handler: function () {
                    $('#SendBox-add').dialog('close')
                }
            }]
        });


        var list = [];
        $.each(row, function (index, value) {
            list.push(value.deductid)
        });
        // 右侧表格
        $('#SendMainGrid').datagrid({
            data: row,
            fitColumns: false,
            striped: true,
            singleSelect: false,

            loadMsg: "正在加载数据，请稍后...",
            columns: [[
                {title:"流水号",field: 'deductid',width: 100},
                { title: '区划编码名称',field: 'cantonname',width:100},
                { title: '单位标识', field: 'unitid',  width: 110 },
                { title: '单位',	field: 'unitname',width:100},
                { title: '收款户名',	field: 'payeeaccountname',width:110},
                { title: '收款银行帐号',	field: 'payeeaccountcode',width:110},
                { title: '收款银行开户行',	field: 'payeebankname',width:150},
                { title: '收款时间', field: 'accountdate', width: 110 },
                { title: '收款网点', field: 'bankstation',width: 100 },
                { title: '交易流水号', field: 'bankaffirm', width: 100 },
                { title: '付款人', field: 'payer', width: 110 },
                { title: '付款人账号', field: 'payeraccountcode',  width: 110 },
                { title: '付款人账户名', field: 'payeraccountname', width: 100 },
                { title: '金额', field: 'fund', width: 100 },
                { title: '附言', field: 'postscript',  width: 100 },
                {
                    title: '传输状态', field: 'billstate', width: 130, formatter: function (value) {
                        if (value == 1) {
                            return '已传输';
                        } else {
                            return '未传输';
                        }
                    }
                },
            ]],
        });
    }


    //  ----------------确认发送/冲销
    function pageSendInfo() {
        var usercode = $('#usercode').val();
        var userpwd = $('#userpwd').val();
        if (usercode == null || usercode == '') {
            $.messager.alert('提示', '请输入用户编码', 'info');
            return;
        }
        if (userpwd == null || userpwd == '') {
            $.messager.alert('提示', '请输入用户密码', 'info');
            return;
        }
        var row = $('#SendMainGrid').datagrid('getData');
        var list = [];
        $.each(row.rows, function (index, value) {
            list.push(value.deductid)
        });

        var opt = $('#biaoshi').val();
        console.log(opt);
        var url = (opt == 1) ? '/bill/deduct/sendDeduct' : '/bill/deduct/cleanDeduct';
        var billids = [];
        $.ajax({
            url: prefix + url,
            type: 'POST',
            data: {
                usercode: usercode,
                userpwd: userpwd,
                billids: list.toString()
            },
            dataType: 'json',
            success: function (data) {
                $.messager.alert('提示', data.msg, 'info');
            }
        });
    }

    function exportInfo() {
        var row = $('#MainGrid').datagrid('getSelections');
        var billids = [];
        $.each(row, function (index, value) {
            billids.push(value.deductid)
        });
        var payeeaccountcode = $('#payeeaccountcodefind').val();
        if (payeeaccountcode == null || payeeaccountcode == '') {
            $.messager.alert('提示', '请选择账户', 'info');
            return;
        }
        console.log(billids);
        if (row == '' || row.length < 1) {
            $.messager.alert('提示', '请选择要导出的数据', 'info');
            return;
        }
        var downurl = prefix + '/bill/deduct/deductExport?1=1';

        billids == "" ? downurl = downurl : downurl = downurl + "&billids=" + billids;
        window.location.href = downurl;
    }


    function cancelInfo() {
        $('#SendBox-add').dialog('close')
    }
    $('#payeeaccountcodefind').combogrid({
        panelWidth:550,
        idField:'accountcode',
        textField:'payeraccountcode',
        url:prefix+'/base/basedata/findBank',
        columns:[[
            {field: 'ck', checkbox: true},
            {field:'cantonname',title:'区划',width:80},
            {field:'accountcode',title:'账号',width:160},
            {field:'bankname',title:'开户行名称',width:260}
        ]]
    });
</script>
</body>
</html>